import Vue from "vue"
import Vuex from "vuex"


//2. 使用vuex插件
Vue.use(Vuex);


//3.实例化一个vuex仓库,并暴露
//4. 给仓库传入配置(state mutations actions getters modules)
export default new Vuex.Store({
    state: {
      count: 0,
      num:0,
    },
    mutations: {
        increment(state) {
            state.count++;
          },
          decrement(state) {
            state.count--;
          },
          //你可以向 store.commit 传入额外的参数，即 mutation 的 载荷（payload）,在mutations方法中第二个参数接受
          incrementN(state, payload) {
            state.count += payload.n;
          },
          // 可以实现，但工具不能监听（mutation必须是同步函数）
          // incrementWait(state){
          //   setTimeout(()=>{
          //     state.count++
          //   },2000)
          // }
    },
    actions: {
       /* 
      actions中方法的任务1. 执行异步操作  2. 提交mutations更新state
      actions的方法接受一个阉割版的store作为参数,我们可以使用store上的commit方法提交mutation
      actions的方法接受的第二个参数是dispatch时候传递的参数
    */
      incrementWait(store){
        setTimeout(()=>{
          store.commit("increment")
        },3000)
      },
      incrementNWait(store,n){
        setTimeout(()=>{
        //提交mutation的时候,需要遵守payload写法
          store.commit("incrementN",{n:n})
        },3000)
      }
    },
    getters: {
      doubleCount(state){
        return state.count*2
      }
    },
  });